<template>
  <div>
    <div class="n-layout-page-header" style="margin: 0">
      <n-card :bordered="false" :header-style="{
                    padding: '20px',
                  }">
        <template #header>
          <text style="font-weight: 500;font-size: 18px;color: #3D3D3D;line-height: 25px;">员工分销</text>
        </template>
      </n-card>
    </div>

    <n-card :bordered="false" class="proCard">
      <n-tabs
        type="card"
        class="card-tabs"
        animated
        @onBeforeLeave="handleBeforeLeave"
        :pane-style="{
                    padding: '0',
                  }"
      >
        <n-tab-pane name="channelIndex" tab="员工管理"> <IndexList /></n-tab-pane>
        <n-tab-pane name="channelWithdraw" tab="员工提现"> <WithdrawList /> </n-tab-pane>
      </n-tabs>
    </n-card>
  </div>
</template>

<script lang="ts" setup>
  import { onMounted, ref } from 'vue';
  import IndexList from '@/views/pmsStaff/index.vue';
  import WithdrawList from '@/views/pmsWithdraw/index.vue';

  const defaultTab = ref('');

  onMounted(() => {
  });

  function handleBeforeLeave(tabName: string) {
    defaultTab.value = tabName;
  }
</script>

<style lang="less" scoped></style>
